<template>
  <div class="subMeun" v-show="submeunflag" @mouseleave="handleMounseLeave" >
    <div class="subMeun_left">
      <ul class="mian_title">
        <li>
          <a href="javascript:;">111111</a>
        </li>
        <li>
          <a href="javascript:;">最畅销</a>
        </li>
        <li>
          <a href="javascript:;">2019年春/夏</a>
        </li>
        <li>
          <a href="javascript:;">旅行灯</a>
        </li>
        <li>
          <a href="javascript:;">NOMAD CAPSULE</a>
        </li>
      </ul>
      <ul class="outwear">
        <li>
          <a href="javascript:;">风雪大衣</a>
        </li>
        <li>
          <a href="javascript:;">轰炸机</a>
        </li>
        <li>
          <a href="javascript:;">轻质羽绒服</a>
        </li>
        <li>
          <a href="javascript:;">背心</a>
        </li>
        <li>
          <a href="javascript:;">轻质夹克</a>
        </li>
      </ul>
      <ul class="outwear">
        <li>
          <a href="javascript:;">HyBridge针织</a>
        </li>
        <li>
          <a href="javascript:;">WindBridge</a>
        </li>
        <li>
          <a href="javascript:;">针织</a>
        </li>
        <li>
          <a href="javascript:;">重量级针织</a>
        </li>
        <li>
          <a href="javascript:;">中量针织</a>
        </li>
        </ul>
          <ul class="outwear">
            <li>
              <a href="javascript:;">风雪大衣</a>
            </li>
            <li>
              <a href="javascript:;">轰炸机</a>
            </li>
            <li>
              <a href="javascript:;">轻质羽绒服</a>
            </li>
            <li>
              <a href="javascript:;">背心</a>
            </li>
            <li>
              <a href="javascript:;">轻质夹克</a>
            </li>
          </ul>
    </div>
    <div class="subMeun_right">
      <ul class="mian_shop">
        <li>
          <a href="javascript:;">帽子</a>
        </li>
        <li>
          <a href="javascript:;">手套和手套</a>
        </li>
        <li>
          <a href="javascript:;">围巾</a>
        </li>
        <li>
          <a href="javascript:;">旅行灯</a>
        </li>
        <li>
          <a href="javascript:;">GORE-TEX</a>
        </li>
      </ul>
      <div class="subMeun_img">
        <img
          src="https://images.canadagoose.com/c_scale,f_auto,q_auto:best,w_765/cg-global/pages/plp-category-banners/img/nav-img/kids-shop.jpg"
          alt
        />
      </div>
    </div>
  </div>
</template>
<script>
export default {
  props:['submeunflag'],
  data(){
    return {
      flag:false
    }
  },
  methods :{
    handleMounseLeave(){
      this.$emit('mounse-leave', this.flag)
    }
  }
}
</script>
<style lang="less" scoped>
@media screen and (max-width: 1024px) {
  @import url(../assets/css/mobile_menusubmenu.less);
}
  @media screen and (min-width: 1024px) {
  @import url(../assets/css/pc_menusubmenu.less);
}
</style>